<template>
  <div class="container">
    <div
      v-for="item in itemArr"
      :key="item.id"
      class="item"
    >
      {{ item.name }}
    </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      itemArr: [
        {
          id: 1,
          name: 'item 1'
        },
        {
          id: 2,
          name: 'item 2'
        },
        {
          id: 3,
          name: 'item 3'
        },
        {
          id: 4,
          name: 'item 4'
        },
        {
          id: 5,
          name: 'item 5'
        }
      ]
    }
  }
}
</script>
<style lang="less" scoped>
.container {
  width: 300px;
  display: flex;
  flex-direction: column;
  .item {
    background-color: aqua;
    border: 1px solid #888;
    padding: 15px;
    color: #666;
  }
}
</style>
